<template>
  <common-edit-dialog
    :title="title"
    :visible.sync="open"
    :button-loading="comfirmLoading"
    @cancel="cancel"
    @submit="submitForm"
  >
    <el-form
      ref="form"
      v-if="open"
      class="edit-form"
      :model="form"
      :rules="isEdit ? editRules : addRules"
      label-width="135px"
    >
      <el-row :gutter="18">
        <el-col :span="12">
          <el-form-item label="数据源类型" prop="dbType">
            <el-select
              v-model="form.dbType"
              placeholder="请选择"
              style="width: 100%"
              :change="change(form.dbType)"
              ref="typeSelect"
              clearable
              :disabled="isRelatedAssets"
            >
              <el-option
                v-for="item in dbTypeList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="协议"
            v-if="form.dbType === 'elasticSearch'"
            prop="dbSchema"
          >
            <el-select
              v-model="form.dbSchema"
              placeholder="请选择"
              style="width: 100%"
              clearable
            >
              <el-option label="http" value="http"> </el-option>
              <el-option label="https" value="https"> </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="form.dbType === 'elasticSearch'">
          <el-form-item
            label="数据库名称"
            prop="dbName"
            :rules="[
              { required: true, message: '请输入数据库名称', trigger: 'blur' },
            ]"
          >
            <common-input
              v-model="form.dbName"
              placeholder="请输入"
              :maxlength="64"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="form.dbType !== 'elasticSearch'">
          <el-form-item label="数据库名称" prop="dbName">
            <common-input
              v-model="form.dbName"
              placeholder="请输入"
              :maxlength="16"
            />
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="form.dbType === 'hive' || form.dbType === 'hbase'"
        >
          <el-form-item label="kerberos认证" prop="kerberosSwitch">
            <el-radio-group
              v-model="form.kerberosSwitch"
              @change="kerberosSwitchChange"
            >
              <el-radio size="small" label="1">启用</el-radio>
              <el-radio size="small" label="0">关闭</el-radio></el-radio-group
            >
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="form.dbType === 'hive'">
          <el-form-item label="是否启用IMPALA" prop="impalaSwitch">
            <el-radio size="small" v-model="form.impalaSwitch" label="1"
              >启用</el-radio
            >
            <el-radio size="small" v-model="form.impalaSwitch" label="0"
              >关闭</el-radio
            >
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="负责人" prop="principal">
            <choose-dialog
              :selectValue="form.principal"
              @submitDialog="submitDialog"
              @clearInfo="clearInfo"
            ></choose-dialog>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="form.dbType === 'hbase'">
          <el-form-item label="zookeeper集群地址" prop="zkAddress">
            <common-input
              v-model="form.zkAddress"
              placeholder="请输入"
              :maxlength="128"
            />
          </el-form-item>
        </el-col>

        <!-- <el-col :span="12" v-if="form.dbType === 'hbase'">
          <el-form-item label="zookeeper端口号" prop="zkAddress">
            <common-input v-model="form.zkAddress" placeholder="请输入" />
          </el-form-item>
        </el-col> -->
        <el-col :span="12" v-if="form.dbType === 'hbase'">
          <el-form-item label="znode地址" prop="znode">
            <common-input v-model="form.znode" placeholder="请输入" />
          </el-form-item>
        </el-col>

        <el-col :span="12" v-if="form.dbType !== 'hbase'">
          <el-form-item label="IP" prop="dbIp">
            <common-input
              v-model="form.dbIp"
              :verify="false"
              placeholder="支持IPV4/IPV6格式"
              :disabled="(form.ext1 === '1' && !!initIp) || isRelatedAssets"
            />
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="
            form.dbType !== 'hbase' &&
            form.dbType !== 'hdfs' &&
            form.dbType !== 'smb'
          "
        >
          <el-form-item label="端口号" prop="dbPort">
            <common-input-number
              :max-length="5"
              v-model="form.dbPort"
              :disabled="(form.ext1 === '1' && !!initPort) || isRelatedAssets"
            ></common-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="12" class="oracleName" v-if="form.dbType === 'oracle'">
          <el-form-item
            prop="ext3"
            class="ext3"
            label=" "
            :rules="addRules.serviceName"
          >
            <el-radio size="small" v-model="form.ext3" label="0"
              >服务名</el-radio
            >
            <el-radio size="small" v-model="form.ext3" label="1"
              >实例名</el-radio
            >
          </el-form-item>

          <el-form-item prop="serviceName" class="serviceName">
            <common-input v-model="form.serviceName" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col
          :span="24"
          v-if="
            (form.dbType === 'hive' && form.kerberosSwitch === '1') ||
            (form.dbType === 'hbase' && form.kerberosSwitch === '1')
          "
        >
          <el-form-item label="krb5.conf文件位置" prop="krbFile">
            <file-upload
              class="upload-demo"
              v-model="form.krbFile"
              :limit="1"
              ref="krbfileUpload"
              :initFileList="krbFileList"
            ></file-upload>
          </el-form-item>
        </el-col>
        <el-col
          :span="24"
          v-if="
            (form.dbType === 'hive' && form.kerberosSwitch === '1') ||
            (form.dbType === 'hbase' && form.kerberosSwitch === '1')
          "
        >
          <el-form-item label="keytab文件位置" prop="keyTabFile">
            <file-upload
              class="upload-demo"
              v-model="form.keyTabFile"
              :limit="1"
              ref="keyfileUpload"
              :initFileList="keyTabFileList"
            ></file-upload>
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="
            (form.dbType === 'hive' && form.kerberosSwitch === '1') ||
            (form.dbType === 'hbase' && form.kerberosSwitch === '1')
          "
        >
          <el-form-item label="principal登录用户" prop="kdcUser">
            <common-input v-model="form.kdcUser" placeholder="请输入" />
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="
            form.dbType !== 'hive' &&
            form.dbType !== 'hbase' &&
            form.dbType !== 'redis'
          "
        >
          <el-form-item
            label="用户名"
            prop="dbAccount"
            :rules="form.dbType !== 'elasticSearch' ? rules.dbAccount : []"
          >
            <common-input
              :verify="false"
              v-model="form.dbAccount"
              placeholder="请输入"
            />
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="
            form.dbType !== 'hive' &&
            form.dbType !== 'hbase' &&
            form.dbType !== 'hdfs'
          "
        >
          <el-form-item
            label="密码"
            prop="dbPassword"
            :rules="
              (!isEdit &&
                form.dbType !== 'redis' &&
                form.dbType !== 'elasticSearch') ||
              canChangePass
                ? rules.dbPassword
                : []
            "
          >
            <template v-if="isEdit">
              <div v-show="canChangePass" style="display: flex; height: 33px">
                <common-input
                  :verify="false"
                  :type="'password'"
                  v-model="form.dbPassword"
                  placeholder="请输入"
                  :readonly="readonly"
                />
                <el-button
                  style="margin-left: 8px"
                  type="primary"
                  plain
                  @click="changePassword(false)"
                  >取消
                </el-button>
              </div>
              <div v-show="!canChangePass" style="display: flex; height: 33px">
                <el-button type="primary" plain @click="changePassword(true)">
                  重置
                </el-button>
              </div>
            </template>
            <template v-else>
              <common-input
                :verify="false"
                :type="'password'"
                v-model="form.dbPassword"
                placeholder="请输入"
              />
            </template>
          </el-form-item>
        </el-col>

        <el-col :span="12" v-if="form.dbType === 'ftp'">
          <el-form-item label="模式" prop="type">
            <el-radio size="small" v-model="form.type" label="0"
              >主动模式</el-radio
            >
            <el-radio size="small" v-model="form.type" label="1"
              >被动模式</el-radio
            >
          </el-form-item>
        </el-col>

        <el-col
          :span="12"
          v-if="form.dbType === 'ftp' || form.dbType === 'sftp'"
        >
          <el-form-item label="语言编码" prop="utf">
            <el-select v-model="form.utf" placeholder="请输入">
              <el-option
                v-for="item in utfList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="form.dbType === 'smb'">
          <el-form-item label="根路径" prop="url">
            <common-input v-model="form.url" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            :label="needScanDbLabel"
            v-if="
              !form.dbType === 'elasticSearch' ||
              form.dbType === 'redis' ||
              form.dbType === 'mysql' ||
              form.dbType === 'oracle' ||
              form.dbType === 'mongoDB' ||
              form.dbType === 'teledb' ||
              form.dbType === 'telepg' ||
              form.dbType === 'hdfs' ||
              form.dbType === 'smb' ||
              form.dbType === 'ftp' ||
              form.dbType === 'sftp' ||
              form.dbType === 'postgreSQL'
            "
            prop="needScanDb"
            :rules="
              form.dbType === 'postgreSQL' ||
              form.dbType === 'sqlServer' ||
              form.dbType === 'telepg' ||
              form.dbType === 'mongoDB'
                ? rules.needScanDb
                : []
            "
          >
            <common-input v-model="form.needScanDb" placeholder="请输入" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="所属集群" prop="belongColony">
            <common-input v-model="form.belongColony" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="归属数据应用" prop="belongDataApplication">
            <common-input
              v-model="form.belongDataApplication"
              placeholder="请输入"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="对外提供" prop="foreignOffer">
            <common-input v-model="form.foreignOffer" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="业务系统" prop="applicationSystem">
            <el-select
              placeholder="请选择"
              filterable
              clearable
              v-model="form.applicationSystem"
            >
              <el-option
                class="custom-select"
                v-for="(item, index) in businessCodeList"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictLabel"
              >
                <span class="selectList">
                  <common-marquee-text :content="item.dictLabel">
                  </common-marquee-text>
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </common-edit-dialog>
</template>
<script>
import ChooseDialog from "./chooseDialog";
import { portRule } from "@/utils/formRules";
import { validateIP } from "@/utils/formValidates";
import { mapGetters } from "vuex";
import BaseIndex from "@/mixins/BaseIndex";
import BaseList from "@/mixins/BaseList";
import { encode } from "@/utils/aesUtils";
import { queryListByTypeCode } from "@/api/datascan/scanresults/column";
import { update, add, query } from "@/api/datascan/dbinfo/info";
import Server from "@/views/system/monitorStrategy/server.vue";
import FileUpload from "./fileUpload";
import { assetsRelation } from "@/api/analysisCenter/assetsScan";

const rules = {
  dbName: [{ required: true, message: "请输入数据库名称", trigger: "blur" }],
  dbType: [{ required: true, message: "请选择数据源类型", trigger: "blur" }],
  // dbGroupIds: [{ required: true, message: "请选择数据库组", trigger: "blur" }],
  dbIp: [
    { required: true, message: "请输入IP", trigger: "blur" },
    {
      required: true,
      message: "IP错误，支持IPV4/IPV6格式",
      validator: validateIP,
      trigger: "blur",
    },
  ],
  dbSchema: [{ required: true, message: "请选择协议", trigger: "blur" }],
  dbPort: portRule,
  serviceName: [
    { required: true, message: "请输入实例名或服务名", trigger: "blur" },
  ],
  dbAccount: [{ required: true, message: "请输入用户名", trigger: "blur" }],
  dbPassword: [{ required: true, message: "请输入密码", trigger: "blur" }],
  needScanDb: [
    { required: true, message: "请输入待扫描库名称", trigger: "blur" },
  ],
  applicationSystem: [
    { required: true, message: "请选择业务系统", trigger: "bldbPasswordur" },
  ],
  kerberosSwitch: [
    { required: true, message: "请选择kerberos认证", trigger: "blur" },
  ],

  kdcUser: [
    { required: true, message: "请输入principal登录用户", trigger: "blur" },
  ],
  url: [{ required: true, message: "请输入根路径", trigger: "blur" }],
  type: [{ required: true, message: "请选择模式", trigger: "blur" }],
  utf: [{ required: true, message: "请选择语言编码", trigger: "blur" }],
  impalaSwitch: [{ required: true, message: "请选择impala", trigger: "blur" }],
};
export default {
  name: "Info",
  components: { ChooseDialog, Server, FileUpload },
  mixins: [BaseIndex, BaseList],

  props: {
    businessCodeList: {
      type: Array,
    },
    isRelatedAssets: {
      type: Boolean,
      default: false,
    },
  },

  data() {
    return {
      readonly: true,
      krbFileList: [],
      keyTabFileList: [],
      userInfo: null,
      needScanDbLabel: "",
      isShow: false,
      dbTypeList: [], // 数据源类型
      dbGroupList: [],
      connectStatusList: [
        {
          label: "正常",
          value: 0,
        },
        {
          label: "网络异常",
          value: 1,
        },
        {
          label: "权限异常",
          value: 2,
        },
        {
          label: "其他",
          value: 3,
        },
      ], // 状态
      key: "dbId",
      form: {
        dbId: "",
        dbName: "", // 数据库名称
        dbType: "", // 类型
        // dbGroupIds: "",
        dbIp: "", // ip
        dbPort: 80, // 端口
        dbAccount: "", // 账号
        dbPassword: "", // 密码
        ext3: "0",
        needScanDb: "", // 待扫描的库
        serviceName: "", // 实例名
        belongColony: "", //所属集群
        belongDataApplication: "", //归属数据应用
        foreignOffer: "", //对外提供
        applicationSystem: "", //应用系统
        dept: "", //部门
        principal: "", //负责人
        telephone: "", //负责人电话
        ext1: "0",
        dbSchema: "",
        kerberosSwitch: "1",
        impalaSwitch: "1",
        kdcUser: "",
        url: "",
        type: "0",
        utf: "",
        zkAddress: "",
        znode: "",
      }, // 表单参数
      utfList: [
        {
          label: "UTF-8",
          value: "UTF-8",
        },
        {
          label: "GBK",
          value: "GBK",
        },
        {
          label: "GB2312",
          value: "GB2312",
        },
        {
          label: "ISO-8859-1",
          value: "ISO-8859-1",
        },
      ],
      // 表单校验
      addRules: {
        ...rules,
        dbPassword: [
          { required: true, message: "请输入数据库密码", trigger: "blur" },
        ],
        serviceName: [
          { required: true, message: "请输入实例名或服务名", trigger: "blur" },
        ],
        krbFile: [
          {
            required: true,
            validator: (rule, value, callback) => {
              if (
                this.$refs.krbfileUpload.$refs.upload.uploadFiles &&
                this.$refs.krbfileUpload.$refs.upload.uploadFiles.length === 0
              ) {
                callback("请上传krb5.conf文件位置");
              } else {
                callback();
              }
            },
            trigger: "blur",
          },
        ],
        keyTabFile: [
          {
            required: true,
            validator: (rule, value, callback) => {
              if (
                this.$refs.keyfileUpload.$refs.upload.uploadFiles &&
                this.$refs.keyfileUpload.$refs.upload.uploadFiles.length === 0
              ) {
                callback("请上传keyTab文件位置");
              } else {
                callback();
              }
            },
            trigger: "blur",
          },
        ],
      },
      editRules: {
        ...rules,
        krbFile: [
          {
            required: true,
            validator: (rule, value, callback) => {
              if (
                this.$refs.krbfileUpload.$refs.upload.uploadFiles &&
                this.$refs.krbfileUpload.$refs.upload.uploadFiles.length === 0
              ) {
                callback("请上传krb5.conf文件位置");
              } else {
                callback();
              }
            },
            trigger: "blur",
          },
        ],
        keyTabFile: [
          {
            required: true,
            validator: (rule, value, callback) => {
              if (
                this.$refs?.keyfileUpload?.$refs?.upload?.uploadFiles &&
                this.$refs?.keyfileUpload?.$refs?.upload?.uploadFiles
                  ?.length === 0
              ) {
                callback("请上传krb5.conf文件位置");
              } else {
                callback();
              }
            },
            trigger: "blur",
          },
        ],
      },
      allDepList: [],
      userList: [],
      valueConsistsOf: "ALL",
      currentParent: 4,
      singleDeptList: [],
      deptListParams: [],
      buttonLoading: false,
      comfirmLoading: false,
      initPort: null,
      initIp: null,
      isEdit: false,
      open: false,
      title: "",
    };
  },
  computed: {
    ...mapGetters(["systemInfo"]),
  },
  methods: {
    kerberosSwitchChange(val) {
      if (val === "0") {
        this.krbFileList = [];
        this.keyTabFileList = [];
      }
    },
    show(row) {
      this.comfirmLoading = false;
      this.krbFileList = [];
      this.keyTabFileList = [];
      if (row && row.dbId) {
        this.form.dbPort = this.form.dbPort ? parseInt(this.form.dbPort) : "";
        this.krbFileList.push({ name: row.krbFileName });
        this.keyTabFileList.push({ name: row.keyTabFileName });
        this.isEdit = true;
        this.title = "编辑数据库资产";
        this.handleInfo(row.dbId).finally(() => {
          this.open = true;
        });
      } else {
        this.open = true;
        this.isEdit = false;
        if (this.isRelatedAssets) {
          this.form = this.$options.data().form;
          this.form.dbType = row.dbType;
          this.form.dbIp = row.nmapIp;
          this.form.dbPort = +row.nmapPort || 80;
          this.form.nmapRecordId = row.id;
          this.title = "关联资产";
        } else {
          this.form.dbPort = parseInt(this.form.dbPort);
          this.resetForm();
          this.title = "新增数据库资产";
        }
      }
    },
    cancel() {
      this.open = false;
      this.resetForm();
      this.changePassword(false);
    },
    resetForm() {
      this.form.dbId = "";
      this.form.dbName = "";
      this.form.dbType = "";
      // this.form.dbGroupIds = "";
      this.form.dept = "";
      this.form.dbIp = "";
      this.form.dbPassword = "";
      this.form.dbPort = 80;
      this.form.serviceName = "";
      this.form.dbAccount = "";
      this.form.needScanDb = "";
      this.form.principal = "";
      this.form.belongColony = "";
      this.form.belongDataApplication = "";
      this.form.foreignOffer = "";
      this.form.applicationSystem = "";
      this.form.ext1 = "0";
      this.form.dbSchema = "";
      this.form.kerberosSwitch = "1";
      this.form.impalaSwitch = "1";
      this.form.kdcUser = "";
      this.form.url = "";
      this.form.type = "";
      this.form.utf = "";
      this.form.zkAddress = "";
      this.form.keyTabFileName = "";
      this.form.krbFileName = "";
    },
    change(row) {
      if (
        (row && row === "oracle") ||
        (row && row === "mongoDB") ||
        (row && row === "hdfs") ||
        (row && row === "smb")
      ) {
        this.needScanDbLabel = "待扫描库用户";
      } else if (row && row === "elasticSearch") {
        this.needScanDbLabel = "待扫描索引名称";
      } else {
        this.needScanDbLabel = "待扫描库名称";
      }
    },
    submitDialog(info, departName) {
      this.form.principal = info.userName;
      info.deptFullNameArr = info.deptFullNameArr.reverse();
      this.form.dept = info.deptFullNameArr[0];
      this.form.telephone = info.phonenumber;
    },

    clearInfo() {
      this.form.principal = "";
      this.form.dept = "";
      this.form.telephone = "";
    },
    changePassword(flag) {
      setTimeout(() => {
        this.readonly = false;
      }, 100);
      this.changePassword2(flag);
      if (!flag) {
        this.form.dbPassword = "";
      }
    },

    update(form) {
      return new Promise((resolve, reject) => {
        this.comfirmLoading = true;
        if (form.dbType === "hive" || form.dbType === "hbase") {
          const formData = new FormData();
          const krbfileUpload =
            this.$refs?.krbfileUpload?.$refs?.upload?.uploadFiles[0]?.raw;
          const keyfileUpload =
            this.$refs?.keyfileUpload?.$refs?.upload?.uploadFiles[0]?.raw;
          if (krbfileUpload && keyfileUpload) {
            formData.append("krbFile", krbfileUpload);
            formData.append("keyTabFile", keyfileUpload);
          }
          form.dbPassword = "";
          form.dbPort = form.dbPort ? parseInt(form.dbPort) : "";
          form.keyTabFileName = this.keyTabFileList[0]?.name;
          form.krbFileName = this.krbFileList[0]?.name;
          Object.keys(form).forEach((item, index) => {
            formData.append(`${item}`, Object.values(form)[index]);
          });
          update(formData, form.dbType === "hive" || form.dbType === "hbase")
            .then((res) => {
              this.$emit("flushedList");
              resolve(res);
            })
            .catch((res) => {
              reject(res);
            })
            .finally(() => {
              this.comfirmLoading = false;
            });
        } else {
          update({
            ...form,
            dbPassword: form.dbPassword === "" ? "" : form.dbPassword,
            needScanDb: !form.needScanDb ? undefined : form.needScanDb,
          })
            .then((res) => {
              this.$emit("flushedList");
              resolve(res);
            })
            .catch((res) => {
              reject(res);
            })
            .finally(() => {
              this.comfirmLoading = false;
            });
        }
      });
    },
    add(form) {
      return new Promise((resolve, reject) => {
        this.comfirmLoading = true;
        if (form.dbType === "hive" || form.dbType === "hbase") {
          const formData = new FormData();
          const krbfileUpload =
            this.$refs?.krbfileUpload?.$refs?.upload?.uploadFiles[0]?.raw;
          const keyfileUpload =
            this.$refs?.keyfileUpload?.$refs?.upload?.uploadFiles[0]?.raw;
          if (krbfileUpload && keyfileUpload) {
            formData.append("krbFile", krbfileUpload);
            formData.append("keyTabFile", keyfileUpload);
          }

          Object.keys(form).forEach((item, index) => {
            formData.append(`${item}`, Object.values(form)[index]);
          });
          if (this.isRelatedAssets) {
            assetsRelation(
              formData,
              form.dbType === "hive" || form.dbType === "hbase"
            )
              .then((res) => {
                if (res && res.code === 200) {
                  this.$emit("flushedList");
                  resolve(res);
                }
              })
              .catch((res) => {
                reject(res);
              })
              .finally(() => {
                this.comfirmLoading = false;
              });
          } else {
            add(formData, form.dbType === "hive" || form.dbType === "hbase")
              .then((res) => {
                this.$emit("flushedList");
                resolve(res);
              })
              .catch((res) => {
                reject(res);
              })
              .finally(() => {
                this.comfirmLoading = false;
              });
          }
        } else {
          if (this.isRelatedAssets) {
            assetsRelation(form)
              .then((res) => {
                if (res && res.code === 200) {
                  this.$emit("flushedList");
                  resolve(res);
                }
              })
              .catch((res) => {
                reject(res);
              })
              .finally(() => {
                this.comfirmLoading = false;
              });
          } else {
            add(form)
              .then((res) => {
                this.$emit("flushedList");
                resolve(res);
              })
              .catch((res) => {
                reject(res);
              })
              .finally(() => {
                this.comfirmLoading = false;
              });
          }
        }
      });
    },
    getDataSourceTypeList() {
      queryListByTypeCode().then((res) => {
        if (res && res.code === 200) {
          this.dbTypeList = res.data.dataList.reduce((r, c) => {
            r.push({
              label: c.name,
              value: c.value,
            });
            return r;
          }, []);
        } else {
          this.dbTypeList = [];
        }
      });
    },
    /**
     * 提交之前的数据操作
     */
    beforeSubmit(params) {
      if (params.dbPassword) params.dbPassword = encode(params.dbPassword);
      // this.form.dbPassword = encode(this.form.dbPassword)
    },

    getInfo(id) {
      return new Promise((resolve, reject) => {
        query({ dbId: id }).then((res) => {
          if (res && res.code === 200 && res.data) {
            let info = this.list.find((item) => item.dbId === id);

            // let dbGroupIds =
            //   info && info.boundIds ? info.boundIds.split(",").map(Number) : [];
            resolve({
              ...res.data,
              // dbGroupIds,
            });
          } else {
            reject();
          }
        });
      });
    },
    handleInfo(id) {
      return new Promise((resolve, reject) => {
        this.getInfo(id)
          .then((info) => {
            Reflect.ownKeys(this.form).forEach((k) => (this.form[k] = info[k]));
            if (this.form.kerberosSwitch === "0") {
              this.krbFileList = [];
              this.keyTabFileList = [];
            }
            this.userInfo = {
              userName: info.principal,
              nickName: info.principal,
            };
            this.initIp = info.dbIp;
            this.initPort = info.dbPort;
            resolve();
          })
          .catch((err) => {
            reject();
          });
      });
    },
  },
  userCodeBut(data) {
    this.form.dept = data.depName;
    this.form.principal = data.userName;
  },
  mounted() {
    this.getDataSourceTypeList();
  },
};
</script>

<style scoped lang="scss">
.oracleName {
  display: flex;
  .ext3 {
    ::v-deep .el-form-item__content {
      margin-left: 60px !important;
    }
    ::v-deep .el-form-item__label {
      width: 60px !important;
    }
  }
  .serviceName {
    width: calc(100% - 222px);
    ::v-deep .el-form-item__content {
      margin-left: 8px !important;
    }
  }
}
</style>
